<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>ERP管理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="/static/css/font.css">
    <link rel="stylesheet" href="/static/css/xadmin.css">
    <script src="/static/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/static/js/xadmin.js"></script>
    <script type="text/javascript" src="/static/js/jquery.min.js"></script>

    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        body{
            padding: 10px;
        }
        .layui-form-item{
            width: 80%;
        }
    </style>
</head>
<body>
<form class="layui-form" action="">
    <div class="layui-form-item">
        <label class="layui-form-label">客户</label>
        <input type="hidden" name="uid" value="{$user.id}">
        <div class="layui-input-block">
            <input type="text" name="name" required  lay-verify="required"value="{$user.name}" autocomplete="off" class="layui-input" readonly>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手机</label>
        <div class="layui-input-block">
            <input type="text" name="phone" required  lay-verify="required"value="{$user.phone}" autocomplete="off" class="layui-input" readonly>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">公司</label>
        <div class="layui-input-block">
            <input type="text" name="company" value="{$user.company}" autocomplete="off" class="layui-input" readonly>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">地址</label>
        <div class="layui-input-block">
            <input type="text" name="address" required  lay-verify="required"value="{$user.address}" autocomplete="off" class="layui-input" readonly>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">商品</label>
        <div class="layui-card-body layui-table-body layui-table-main">
            <table class="layui-table layui-form">
                <thead>
                <tr>
                    <th>商品名</th>
                    <th>数量</th>
                    <th>规格</th>
                    <th>单位</th>
                    <th>单价</th>
                    <th>小计</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                {volist name="goods" id="v"}
                <tr class="y">
                    <input type="hidden"  class="id" value="{$v.id}">
                    <td>{$v.name}</td>
                    <td style="padding: 0">
                        <input type="number" name="number" class="num" value="{$v.num}" id="num_{$v.id}" onchange="num_change({$v.id})" min="1" style="width: 98%;height: 36px;">
                    </td>
                    <td>{$v.specs}</td>
                    <td>{$v.unit}</td>
                    <td id="pr_{$v.id}">{$v.price}</td>
                    <td >
                        <input id="sub_{$v.id}" class="sub" name="money" type="text" value="{$v.num * $v.price}" style="border: none" readonly>
                    </td>
                    <td onclick="del({$v.id})" style="width: 5%;cursor:pointer;">删除</td>
                </tr>
                {/volist}
                <tr style="color: #000;">

                    <a title="添加"  onclick="xadmin.open('选择商品','addOrder/?o=3&uid={$user.id}',1000,600)" href="javascript:;">
                        <i class="layui-icon" style="color: #1E9FFF">&#xe61f;添加商品</i>
                    </a>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">总计</label>
        <div class="layui-input-block">
            <input type="text" name="total_price"  required  lay-verify="required"value="0" autocomplete="off" class="layui-input" readonly>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">备注</label>
        <div class="layui-input-block">
            <textarea name="remark" placeholder="请输入内容" class="layui-textarea"></textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>

        </div>
    </div>
</form>

<script>
    function num_change(id){
        var num = $("#num_"+id).val();
        var pr = $("#pr_"+id).text();
        var sub = num * pr;
        $("#sub_"+id).val(sub);

        var s = new Array();
        $(".y").each(function(){
            var tp = $(".y").children("#sub_"+id).val();
            s.push(tp);
        })
        $.ajax({
            url:"/index/Order/numChange",
            data:{num:num,id:id},
            type:"post"
        })
        getTotal()
    }
    $(function(){
        getTotal()
    })
    function getTotal(){
        var sum = 0;
        $('input[name="money"]').each(function(){
            //这样调用自定义的相加方法
            value= this.value;
            sum = accAdd(sum, value);

            //或者通过自定义的Number属性add调用自定义方法
            // var value = Number($(this).val());
            // sum  = value.add(sum);
        });
        // console.log(sum)
        $('input[name="total_price"]').val( sum );
    }
    // $('.this_container input[name="money"]').on("keyup", getTotal).trigger('keyup');

    function accAdd(arg1, arg2) {
        var r1, r2, m, c;
        try {
            r1 = arg1.toString().split(".")[1].length;
        }
        catch (e) {
            r1 = 0;
        }
        try {
            r2 = arg2.toString().split(".")[1].length;
        }
        catch (e) {
            r2 = 0;
        }
        c = Math.abs(r1 - r2);
        m = Math.pow(10, Math.max(r1, r2));
        if (c > 0) {
            var cm = Math.pow(10, c);
            if (r1 > r2) {
                arg1 = Number(arg1.toString().replace(".", ""));
                arg2 = Number(arg2.toString().replace(".", "")) * cm;
            } else {
                arg1 = Number(arg1.toString().replace(".", "")) * cm;
                arg2 = Number(arg2.toString().replace(".", ""));
            }
        } else {
            arg1 = Number(arg1.toString().replace(".", ""));
            arg2 = Number(arg2.toString().replace(".", ""));
        }
        return (arg1 + arg2) / m;
    }

    function del(id){

        $.ajax({
            url:"/index/Order/delCart",
            data:{id:id},
            type:"post",
            dataType:"json",
            success:function (res) {
                layer.alert("删除成功", {
                        icon: 6
                    },
                    function() {
                        window.location.href='';

                    });
            }
        })
    }


    layui.use('form', function(){
        var form = layui.form;

        //监听提交
        form.on('submit(formDemo)', function(data){
            var data = data.field;
            var i = new Array();
            $(".id").each(function(){
                value= this.value;
                i.push(value);
            });
            if (i.length == 0 ){
                layer.alert("未选中任何产品", {
                    icon: 5
                });
                return false;
            }
            $.ajax({
                url:"/index/Order/addorder",
                data:{data:data,id:i},
                type:"post",
                dataType:"json",
                success:function (res) {
                    if (res.code){
                        layer.alert(res.msg, {
                                icon: 6
                            },
                            function() {
                                //关闭当前所有
                                xadmin.close();
                                top.location.reload();
                                window.location.href="/index/Odo/index";
                            });
                    }else{
                        layer.alert(res.msg, {
                            icon: 5
                        })
                    }
                }
            })
            return false;
        });
    });
</script>

</body>

</html>